<template>
	<div class="pcindex">
		<!--导航栏-->
		<div class="t_banner">
			<img src="../assets/index/index_10.jpg" alt="" class="ban_fix" />
			<!--<div class="t_banner_back"> 
				
			</div>-->
		<div class="dh_pc">
			<div class="logo">
				<img src="../assets/logo.png"/>
			</div>
			<div style="width:30%;"></div>
			<div class="dh_list">
				<ul class="dh_ul">
					 <!--v-for="site in lilist"-->
					 <!-- :class="{dh_ul_li:site.index != dhindex,'dhli':site.index == dhindex}"-->
					<li><router-link :to="{name: 'pcindex'}">首页</router-link></li>
					<li  v-on:click="mouseenover()" >
						<div class="bigData"><span>大数据</span><span  :class="{ down: down, 'top': top}"></span>	
						<div class="bigPanel" v-show="bigDataPanel">		
								<p v-for="data in bigDataList" v-on:click="choseData(data.name,data.index)">{{data.name}}</p>
						</div>
					 </div>	
					</li>
					<li v-on:mouseover="mouseenoverone()"><span>测试测评</span><span  :class="{ down: onedown, 'top': onetop}"></span></li>
					<li v-on:mouseover="mouseenovertwo()"><span>志愿填报</span><span  :class="{ down: towdown, 'top': towtop}"></span></li>
					<li>有问必答</li>
					<li>新闻资讯</li>
				</ul>
			</div>
		</div>
		
		<!--顶部分类按钮-->
		<div class="catgren">
			<div class="cat_list" >
				<ul >
					<li v-for="site in catlist">
						<div class="">
							<p><img src="../assets/index/index_15.jpg" alt="" /></p>
							<span>{{site.name}}</span>
						</div>
					</li>
					
				</ul>
			</div>
		</div>
	</div>
		<!--输入分数查找院校-->
	
	   <div class="find_port">
	     <img src="../assets/index/images/port_03.png" alt="" class="port"/>
	     <div class="t_table">
	     	<div class="t_table_title">输入分数，即可推荐最适合您的院校、专业和志愿</div>
	     	<div class="t-injor">
	     		<ul>
	     			<li>
	     				<div class="chose_address" v-on:click="addList()">{{adname}}<span></span>
	     					<div class="chose_address_panel" v-show="addressPanel">
	     						<ol>
	  				            <li v-for="list in addressList" v-on:click="choseAddress(list.name,list.index)"><span>{{list.index}}&nbsp&nbsp{{list.name}}</span></li>
	  			                </ol>
	     					</div>
	     				</div>
	     			</li>
	     			</ul>
	     			<ul>
	     			<li>
	     				<div class="chose_intrest"  v-on:click="choseList()">{{course}}<span></span>
	     					 <div class="ul_panel"  v-show="ulPanel">
	  				           <ol  >
	  					       <li v-for="list in classeslist" v-on:click="courseChose(list.name,list.value)"><span>{{list.name}}</span></li>
	  				      </ol>
	  			</div>
	     					
	     				</div>
	     			</li>
	     			</ul>
	     			<ul>
	     			<li>
	     				<input type="text" name="text" placeholder="分数*"/>
	     			</li>
	     			</ul>
	     		</ul>
	     	</div>
	     	<div class="hint">
	     		<div class="proty">优先项</div>
	     		<div style="width:100px;height:50px;display: inline-block;"></div>
	     		<div class="s_proty">下拉选择项</div>
	     	</div>
	     	<div class="sub">
	     		立即推荐
	     	</div>
	     </div>
	   </div>
	   <!--测试录取概率-->
	   <div class="test">
	   	 <div class="test_c">
	   	 	<div class="test_injr">
	   	 		<p class="test_injr_title"><b>Welcome</b></p>
	   	 		<span>欢迎使用i思人工智能志愿填报服务</span>
	   	 		
	   	 			<p class="exam_title">高考倒计时</p>
	   	 			<div class="exam">
	   	 				<ul>
	   	 					<li>
	   	 						<div class="crcle">
	   	 						<p class="crcle_one"><b>100</b>   </p>
	   	 						<p class="crcle_two">DAYS</p>
	   	 						</div>
	   	 					</li>
	   	 					<li>
	   	 						<div class="crcle">
	   	 						<p class="crcle_one"><b>12</b></p>
	   	 						<p class="crcle_two">HOURS</p>
	   	 						</div>
	   	 					</li>
	   	 					<li>
	   	 						<div class="crcle">
	   	 						<p class="crcle_one"><b>50</b></p>
	   	 						<p class="crcle_two">MINUTES</p>
	   	 						</div>
	   	 					</li>
	   	 					<li>
	   	 						<div class="crcle">
	   	 						<p class="crcle_one"><b>48</b></p>
	   	 						<p class="crcle_two">SECONDS</p>
	   	 						</div>
	   	 					</li>
	   	 				</ul>
	   	 		</div>
	   	 	</div>
	   	 	<div class="test_table">
	   	 		<div class="test_cell">
	   	 			<img src="../assets/index/images/test_03.png" alt="" />
	   	 			<div class="test_data">
	   	 				<div class="test-in-data">
	   	 					<div class="target_s">
	   	 						<input type="text" name="target_s" placeholder="目标院校*"/>
	   	 					</div>
	   	 					<div class="target_s">
	   	 						<input type="text" name="target_s" placeholder="目标专业*"/>
	   	 					</div>
	   	 					<div class="target_s">
	   	 						<input type="text" name="target_s" placeholder="高考分数*"/>
	   	 					</div>
	   	 					<div class="test_query">
	   	 						<b>查询</b>
	   	 					</div>
	   	 				</div>
	   	 				
	   	 			</div>
	   	 		</div>
	   	 	</div>
	   	 </div>
	   </div>
	   <!--院校展示-->
	   <div class="s_show">
	   	<div class="show_shool">
	   		<div class="show_shool_left">
	   		<div class="show_title">
	   			<span>院校</span>展示
	   		</div>
	   		<div class="show_lun">
	   			 <vue-seamless-scroll :data="listData" :class-option="classOption" class="warp">
	   				<ul class="item">
                    <li v-for="item in listData">
                    	<div class="title" ><img :src="item.src" alt="" /></div>
                    	<p class="date"  v-text="item.name"></p>	
                    	<span class="date_title" v-text="item.title" ></span>
                    </li>
                </ul>
	   			</vue-seamless-scroll>
	   		</div>
	   		</div>
	   		<div class="show_shool_right">
	   			<div class="tab_shool_top">
	   				
	   				<div class="tab_shool_find">查看全部</div>
	   				<div class="tab_shool_bt">
	   					<span><img src="../assets/index/index_jt_06.png" alt="" /></span>
	   					<span><img src="../assets/index/index_jt_07.png" alt="" /></span>
	   				</div>
	   			</div>
	   			<div class="tab_shool_content">
	   				<div class="tab_shool_intr">
	   					<div class="tab_shool_title">
	   						<div class="ranking">院校排行榜</div>
	   						<div class="find_wank">查看院校完整榜单</div>
	   					</div>
	   					<div class="tab_shool_list">
	   						<div class="s_rank">
	   							<span>排名</span>
	   							
	   								<ul>
	   									<li><span>1</span></li>
	   									<li><span>2</span></li>
	   									<li><span>3</span></li>
	   									<li><span>4</span></li>
	   									<li><span>5</span></li>
	   								</ul>
	   							
	   						</div>
	   						<div class="tab_rank_name">
	   							<span>院校名称</span>
	   							
	   								<ul>
	   									<li><span>清华大学</span></li>
	   									<li><span>清华大学</span></li>
	   									<li><span>清华大学</span></li>
	   									<li><span>清华大学</span></li>
	   									<li><span>清华大学</span></li>
	   								</ul>
	   							
	   						</div>
	   						<div class="tab_rank_mony">
	   							<span>毕业五年薪酬</span>
	   							
	   								<ul>
	   									<li><span>￥100.00/月</span></li>
	   									<li><span>￥100.00/月</span></li>
	   									<li><span>￥100.00/月</span></li>
	   									<li><span>￥100.00/月</span></li>
	   									<li><span>￥100.00/月</span></li>
	   								</ul>
	   						
	   						</div>
	   					</div>
	   				</div>
	   			</div>
	   		</div>
	   	</div>
	   </div>
	   <!--专业展示-->
	    <div class="s_show">
	   	<div class="show_shool">
	   		<div class="show_shool_left">
	   		<div class="show_title">
	   			<span>专业</span>展示
	   		</div>
	   		<div class="show_lun">
	   			<vue-seamless-scroll :data="listData" :class-option="classOption" class="warp">
	   				<ul class="item">
                    <li v-for="item in listData">
                    	<div class="title" ><img :src="item.src" alt="" /></div>
                    	<p class="date"  v-text="item.name"></p>	
                    	<span class="date_title" v-text="item.title" ></span>
                    </li>
                </ul>
               
	   			</vue-seamless-scroll>
	   		</div>
	   		</div>
	   		<div class="show_shool_right">
	   			<div class="tab_shool_top">
	   				
	   				<div class="tab_shool_find">查看全部</div>
	   				<div class="tab_shool_bt">
	   					<span><img src="../assets/index/images/index_17.png" alt="" /></span>
	   					<span><img src="../assets/index/images/index_18.png" alt="" /></span>
	   				</div>
	   			</div>
	   			<div class="tab_shool_content">
	   				<div class="tab_shool_intr">
	   					<div class="tab_shool_title">
	   						<div class="ranking">院校排行榜</div>
	   						<div class="find_wank">查看院校完整榜单</div>
	   					</div>
	   					<div class="tab_shool_list">
	   						<div class="s_rank">
	   							<span>排名</span>
	   							
	   								<ul>
	   									<li><span>1</span></li>
	   									<li><span>2</span></li>
	   									<li><span>3</span></li>
	   									<li><span>4</span></li>
	   									<li><span>5</span></li>
	   								</ul>
	   							
	   						</div>
	   						<div class="tab_rank_name">
	   							<span>院校名称</span>
	   							
	   								<ul>
	   									<li><span>清华大学</span></li>
	   									<li><span>清华大学</span></li>
	   									<li><span>清华大学</span></li>
	   									<li><span>清华大学</span></li>
	   									<li><span>清华大学</span></li>
	   								</ul>
	   							
	   						</div>
	   						<div class="tab_rank_mony">
	   							<span>毕业五年薪酬</span>
	   							
	   								<ul>
	   									<li><span>￥100.00/月</span></li>
	   									<li><span>￥100.00/月</span></li>
	   									<li><span>￥100.00/月</span></li>
	   									<li><span>￥100.00/月</span></li>
	   									<li><span>￥100.00/月</span></li>
	   								</ul>
	   						
	   						</div>
	   					</div>
	   				</div>
	   			</div>
	   		</div>
	   	</div>
	   </div>
	    <!--性格兴趣测试-->
	    <div class="mit">
	    	<div class="mit_content">
	    		<div class="mit_all">
	    			<div class="mit_left">
	    				<div class="intinx">
	    					<div class="nature">
	    						<div class="nature_logo"><img src="../assets/index/index_26.jpg" alt="" /></div>
	    						<div class="nature_intr">
	    							<p class="nature_title"><b>性格测试推专业</b></p>
	    							<p class="nature_content">MBTi性格测试，帮你清晰认知自身性格优势</p>
	    						</div>
	    					</div>
	    					<div class="fast_sub">
	    						<div class="fast_sub_center">开始测试</div>
	    					</div>
	    				</div>
	    			</div>
	    			<div class="mit_right">
	    				<div class="bit_index">
	    					<div class="nature">
	    						<div class="nature_logo"><img src="../assets/index/index_28.jpg" alt="" /></div>
	    						<div class="nature_intr">
	    							<p class="nature_title"><b>兴趣测试推专业</b></p>
	    							<p class="nature_content">霍兰德兴趣测评，帮你发现自己的兴趣倾向</p>
	    						</div>
	    					</div>
	    					<div class="fast_sub">
	    						<div class="fast_sub_center">开始测试</div>
	    					</div>
	    				</div>
	    			</div>
	    		</div>
	    	</div>
	    </div>
	    <!--新闻资讯，分数线预估-->
	    <div class="news_about">
	    	<div class="news_about_all">
	    		<div class="page_about">
	    			<img src="../assets/index/images/news_03.png" alt="" />
	    			<div class="page_about_intr">
	    				<div class="page_about_im">
	    					<div class="page_about_school">
	    						<input type="text" name="" placeholder="目标院校*"/>
	    					</div>
	    					<div class="page_about_prefes">
	    						<input type="text" name="" placeholder="目标专业*"/>
	    					</div>
	    					<div class="fast_pagr_about"><b>查询</b></div>
	    				</div>
	    			</div>
	    		</div>
	    		<!--news-->
	    		<div class="news">
	    			<div class="news_all">
	    				<div class="news_title">
	    					<p><span>新闻</span>资讯&nbsp EVENTS</p>
	    					<div class="tab_shool_find">查看全部</div>
	   				     <div class="tab_shool_bt">
	   					<span><img src="../assets/index/images/index_17.png" alt="" /></span>
	   					<span><img src="../assets/index/images/index_18.png" alt="" /></span>
	   				   </div>
	    				</div>
	    				<div class="news_intr">
	    					<ul>
	    						<li class="news_intr_list">
	    							<div class="news_intr_logo">
	    					         	<img src="../assets/index/images/new_about_03.png" alt="" />
	    					    </div>
	    					 <div class="new_intr_article">
	    					 	<div class="new_intr_content">
	    						 <div class="new_intr_title">新闻标题新闻标题新闻标题</div>
	    						 <div class="new_intr_time">
	    						 	<img src="../assets/index/images/new_about_06.png" alt="" /><span>8:00AM</span>
	    						 </div>
	    						 <div class="new_intr_center">
	    						 	asdasfafafafafafaf1af1a164113a3f1a6fa61f6a1fa31f3a1f6a4f6a41fa516a51g6a4g6a1ga1g6a1g6
	    						 </div>
	    						 </div>
	    					 </div>
	    						</li>
	    						<li class="news_intr_list">
	    							<div class="news_intr_logo">
	    					         	<img src="../assets/index/images/new_about_03.png" alt="" />
	    					    </div>
	    					 <div class="new_intr_article">
	    					 	<div class="new_intr_content">
	    						 <div class="new_intr_title">新闻标题新闻标题新闻标题</div>
	    						 <div class="new_intr_time">
	    						 	<img src="../assets/index/images/new_about_06.png" alt="" /><span>8:00AM</span>
	    						 </div>
	    						 <div class="new_intr_center">
	    						 	asdasfafafafafafaf1af1a164113a3f1a6fa61f6a1fa31f3a1f6a4f6a41fa516a51g6a4g6a1ga1g6a1g6
	    						 </div>
	    						 </div>
	    					 </div>
	    						</li>
	    					</ul>
	    					
	    				</div>
	    			</div>
	    		</div>
	    		<!--底部新闻列表链接-->
	    		<div class="foot_nav">
	    			<div class="fot_news">
	    			<div class="fot_new_left">
	    				<div class="fot_new_left_list">
	    					<ul>
	    						<li><span>新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</span></li>
	    						<li><span>新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</span></li>
	    						<li><span>新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</span></li>
	    					</ul>
	    				</div>
	    			</div>
	    			<div class="fot_new_right">
	    				<div class="fot_new_right_list">
	    					<ul>
	    						<li><span>新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</span></li>
	    						<li><span>新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</span></li>
	    						<li><span>新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</span></li>
	    					</ul>
	    				</div>
	    			</div>
	    			</div>
	    		</div>
	    	</div>
	    </div>
	</div>
</template>

<script>
	import vueSeamlessScroll from 'vue-seamless-scroll'
	export default{
		name:'pcindex',
		data(){
			return{
			 down:true,  //大数据
			 top:false,   //大数据
			  onedown:true,  //测试测评
			  onetop:false,   //测试测评
			  towdown:true,  //智能志愿
			  towtop:false,  //智能志愿
			  bigDataPanel:false,  //大数据面板
			  dhindex:1,     //导航下标
			  catdhindex:1,    //主要导航下标
			  course:'理科',
			  adindex:'s',  //地址选择
			  adname:'省份*',  //地址选择
			 addressPanel:false,
			 ulPanel:false,
			  catlist:[
			   {name:'大数据',src:"../assets/index/index_15.jpg",index:1},
			   {name:'心理评测',src:"../assets/index/index_15.jpg",index:2},
			   {name:'人工智能',src:"../assets/index/index_15.jpg",index:3},
			   {name:'测录取概率',src:"../assets/index/index_15.jpg",index:4},
			   {name:'分数线预估',src:"../assets/index/index_15.jpg",index:5},
			   {name:'权威报告',src:"../assets/index/index_15.jpg",index:6}
			  ],
			 bigDataList:[   //大数据内容
			   {name:'院校大全',index:1},
			   {name:'专业大全',index:2},
			 ],
			 classeslist:[
			  {name:'理科',value:1},
			  {name:'文科',value:2}
			 ],
			 addressList:[
			   {name:'北京',index:'b'},
			   {name:'上海',index:'s'},
			   {name:'广州',index:'g'},
			 ],	 
			 listData:[
			   {name:'院校名称',title:'北京市',src:require("../assets/index/images/s_show_07.png"),index:1,},
			   {name:'院校名称',title:'北京市',src:require("../assets/index/images/s_show_07.png"),index:1,},
			   {name:'院校名称',title:'北京市',src:require("../assets/index/images/s_show_07.png"),index:1,}   
			 ]
			}
		},
		computed: {
              classOption: function () {
                return {
                  
                   step: 0.5, //步长 越大滚动速度越快
                    limitMoveNum: 1, //启动无缝滚动最小数据量 this.dataList.length
                    hoverStop: true, //是否启用鼠标hover控制
                    direction: 2, //1 往上 0 往下
                    openWatch: true, //开启data实时监听
                    singleHeight: 0, //单条数据高度有值hoverStop关闭
                     waitTime: 1000 //单步停止等待时间
                }
              }
           },
		 components: {
                  vueSeamlessScroll 
                },
                methods:{
                	//大数据
			mouseenover:function(){
				this.down = !this.down;
				this.top = !this.top;
				this.bigDataPanel = !this.bigDataPanel;
			},
			//选择大数据
			choseData:function(name,index){
				console.log(name)
				this.bigDataPanel = true;
				this.down = false;
				this.top = true;
				if(index == 1){
					this.$router.push({
                    path:'/pc/pcSchool'
                })//pc端
				}
				else if(index == 2){
					this.$router.push({
                    path:'/pc/pcProfes'
                })//pc端
				}
			},
			//测试测评
			mouseenoverone:function(){
				this.onedown = !this.onedown;
				this.onetop = !this.onetop;
			},
			//智能志愿
			mouseenovertwo:function(){
				this.towdown = !this.towdown;
				this.towtop = !this.towtop;
			},
			//打开选择文理科面板
			choseList:function(){
				this.ulPanel = !this.ulPanel;
			},
		     //选择文理科
		     courseChose:function(name,index){
//		     	console.log(index,name)
		     	this.course = name;
		     },
		     //打开地址选择面板
		     addList:function(){
		     	this.addressPanel = !this.addressPanel;
		     },
		     //选择地址
		     choseAddress(name,index){
		     	console.log(name,index)
		     	this.adname = name;
		     	this.adindex = index;
		     }
                }
		
	}
</script>

<style>
.pcindex{width:100%;overflow: hidden;position: relative;}

@media (min-width: 1024px) {
.find_port{width:1220px;margin:0 auto; position: relative;overflow: hidden;}
.chose_address{position: relative;}
.chose_address_panel{position: absolute;top:40px;width:100%;text-align: center;background-color:#ffffff;border:1px solid #666666;border-top:none;}
.chose_intrest{position: relative;}
.ul_panel{position: absolute;top:40px;width:100%;text-align: center;background-color:#ffffff;border:1px solid #666666;border-top:none;}
.port{width:100%;}
.t_table{position: absolute;z-index: 1;top:165px;width:950px;left:50%;margin-left:-490px;overflow: hidden;}
.t_table_title{text-align: center;font-size:20px;color:#3a3a3a;}	
.t-injor{margin-top:55px;} 
.t-injor ul{float:left;width:30.7%;margin-left:25px;border-bottom: 1px solid #666666;cursor: pointer;}
.t-injor li{}
.t-injor li div{text-align: center;color:#999999;padding-bottom: 17px;}
.t-injor li input{border:none;color:#999999;text-align: center;padding-bottom: 17px;;font-size:16px;outline: none;}
.hint{padding-left:100px;padding-right:100px;padding-top:15px;}
.proty{width:300px;cursor:pointer;display:inline-block;height:50px;border:1px solid #999999;text-align: center;line-height: 50px;color:#cccccc;}
.s_proty{width:300px;height:50px;cursor:pointer;display:inline-block;border:1px solid #999999;text-align: center;line-height: 50px;color:#cccccc;}
.sub{margin-left:270px;margin-right:270px;margin-top:50px;width:400px;height:60px;background-color:#000000;
text-align: center;line-height: 60px;color:#ffffff;font-size:22px;cursor: pointer;}
/*测试录取概率*/
.test{width:100%;height:590px;background-color:#000000;opacity: 0.5;overflow: hidden;position: relative;}
.test_c{width:1220px;margin:0 auto;overflow: hidden;position: relative;}
.test_injr{padding-top:110px;padding-left:20px;color:#ffffff;display: inline-block;}
.test_injr span{font-size:16px;}
.test_injr_title{font-size:60px;}
.exam_title{margin-top:100px;}
.exam_title{font-size:16px;color:#ffffff;}
.exam{margin-top:30px;overflow: hidden ;}
.exam li{float:left;width:125px;height:125px;border:1px solid #ffffff;text-align: center;margin-right:15px;border-radius: 50%;;position: relative;}
.exam li .crcle{width:100px;height:60px;position: absolute;left:50%;margin-left:-50px;top:50%;margin-top:-30px;}
.exam li .crcle .crcle_one{font-size:26px;}
.test_table{padding-top:25px;padding-right:25px;display:inline-block;float:right;}
.test_cell img{width:520px;}
.test_data{width:520px;background-color:#ffffff;}
.test-in-data{padding-top:45px;padding-left:25px;padding-right:40px;padding-bottom: 30px;;}
.target_s input{width:100%;height:50px;outline:none;cursor:pointer;color:#999999;border:none;border:1px solid #666666;padding-left:15px;vertical-align: middle;}
.target_s{margin-bottom: 15px;}
.test_query{width:104%;height:50px;background-color:#000000;
text-align: center;line-height: 50px;color:#ffffff;font-size:16px;cursor: pointer;}
/*院校展示*/
.show_shool{width:1220px;margin:0 auto;overflow: hidden;padding-top:70px;padding-left:25px;padding-right:25px;padding-bottom:60px;border-bottom: 1px solid #666666;}
.show_title{font-size:18px;color:#3A3A3A;}
.show_title span{display:inline-block;border-bottom: 1px solid #666666;}
.show_lun{padding-left:20px;padding-right:20px;padding-top:35px;width:700px;overflow: hidden;}
.show_lun li{float:left;margin-left:20px;margin-right:20px;width:25%;text-align: center;cursor: pointer;}
.show_lun li .date_title{color:#999999;}
.show_lun li p{width:100%;height:35px;background-color:#ffb606;text-align: center;line-height: 35px;color:#3a3a3a;}
.show_school_name{width:180px;height:30px;background-color:#ffcc51;line-height: 30px;text-align: center;font-size:14px;}
.show_shool_left{display:inline-block;position: relative;overflow: hidden;}
.tab_shool_top{overflow: hidden;width: 400px;position: relative;}
.show_shool_right{display: inline-block;overflow: hidden;position: relative;float:right;}
.tab_shool_bt{display: inline-block;position: relative;top:10px;cursor: pointer;float:right;}
.tab_shool_find{float:right; display: inline-block;width:115px;cursor:pointer;margin-left:15px;height:44px;bordeR:1px solid #666666;text-align: center;line-height: 40px;color:#666666;font-size:16px;}
.tab_shool_content{margin-top:40px;border-left:1px solid #666666;padding-left:20px;padding-right:20px;}
.tab_shool_intr{width:400px;}
.tab_shool_title{border-bottom: 1px solid #666666;overflow: hidden;}
.ranking{display: inline-block;font-size:16px;color:#333333;padding-bottom: 15px;;}
.find_wank{display: inline-block;float:right;font-size:12px;color:#333333;padding-bottom: 15px;;}
.tab_shool_list{padding-top:20px;padding-left:20px;padding-right:20px;}
.tab_shool_list div{display: inline-block;}
.tab_rank_name{padding-left:100px;}
.tab_rank_mony{padding-left:100px;}
.tab_shool_list span{font-size:12px;color:#333333;display:inline-block;height:20px;}
.tab_shool_list div li{font-size:14px;color:#333333;margin-bottom: 5px;cursor: pointer;}
.s_rank li{width:20px;height:20px;border-radius: 50%;border:1px solid #666666;text-align: center;line-height: 20px;;}
/*性格兴趣测试*/
.mit{width:100%;background-color:#333333;opacity: 0.5;height:480px;}
.mit_content{width:1220px;overflow: hidden;position: relative;margin: 0 auto;}
.mit_all{padding-top:80px;padding-left:10px;padding-right:10px;overflow:hidden;padding-bottom: 80px;display: flex;display: -webkit-flex;}
.mit_left{width:48%;height:320px;background-color:#000000;margin-right:50px;}
.mit_right{width:48%;height:320px;background-color:#000000;}
.intinx{padding:25px;}
.bit_index{padding: 25px;;}
.nature{width:100%;overflow: hidden;position: relative;}
.nature_intr{display: inline-block;position: absolute;right:30px;width:50%;}
.nature_logo{display: inline-block;}
.nature_title{font-size:25px;color:#ffffff;padding-bottom: 20px;;}
.nature_content{color:#ccccccc;font-size:18px;word-break: normal;}
.fast_sub{padding-left:105px;padding-right:105px;padding-top:30px;}
.fast_sub_center{width:100%;height:60px;background-color:#ffb606;color:#000000;text-align: center;line-height: 60px;cursor: pointer;}
/*分数线预估*/
.news_about{width:100%;padding-top:60px;position: relative;overflow: hidden;float:left !important; }
.news_about_all{width:1220px;margin:0 auto;overflow: hidden;position: relative;}
.page_about{width:521px;position: relative;display: inline-block;}
.page_about_intr{width:100%;border:1px solid #666666;border-top:none;position: relative;top:-5px;left:2px;}
.page_about_im{padding-top:25px;padding-bottom: 25px;padding-left:25px;padding-right:25px;}
.page_about_school input{width:96%;border:none;height:60px;outline:none;border:1px solid #666666;vertical-align: middle;color:#999999;padding-left:15px; }
.page_about_prefes input{width:96%;height:60px;border:none;outline:none;border:1px solid #666666;vertical-align: middle;color:#999999;padding-left:15px;margin-top:25px;margin-bottom: 25px;}
.fast_pagr_about{width:100%;height:60px;background-color:#3a3a3a;text-align: center;line-height: 60px;font-size:16px;color:#ffffff;cursor: pointer;}
.fast_pagr_about:hover{background-color:#ffb606;}
.news{width:690px;display: inline-block;position: relative;overflow: hidden;float:right !important;}
.news_all{padding-left:15px;padding-right:15px;}
.news_title{border-bottom: 1px solid #000000;overflow: hidden;padding-bottom: 10px;}
.news_title p{font-size:18px;color:#000000;}
.news_title p span{display: inline-block;border-bottom: 1px solid #000000;padding-bottom: 5px;}
.news_intr{margin-top:10px;overflow: hidden;position: relative;}
.news_intr_list{border-bottom: 1px solid #000000;padding-bottom: 10px;margin-bottom: 15px;;}
.news_intr_logo{display: inline-block;}
.news_intr li{display:flex;}
.new_intr_article{display: inline-block;}	 
.new_intr_content{padding-left:40px;padding-right:60px;width:80%;}  
.new_intr_title{font-size:18px;color:#000000;} 	
.new_intr_time{color:#797979;margin-top:20px;font-size:12px;}
.new_intr_time img{position: relative;top:5px;}	
.new_intr_center{font-size:12px;color:#797979;margin-top:25px;word-break: normal;word-break:break-all;}	
/**/
.foot_nav{padding-top:30px;}			
.fot_news{width:100%;overflow: hidden;position: relative;display: flex;}
.fot_new_left{width:50%;}
.fot_new_right{width:50%;}
.fot_new_left_list{padding-left:30px;padding-right:70px;border-right:1px solid #666666;}
.fot_new_left_list li{font-size:18px;color:#000000;margin-bottom: 30px;cursor: pointer;}
.fot_new_right_list li{font-size:18px;color:#000000;margin-bottom: 30px;cursor: pointer;}
.fot_new_right_list{padding-left:70px;}
}


</style>